<%@ page language="java" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<c:set var="path" value="${pageContext.request.contextPath}" />
<!DOCTYPE html>
<html>
<head>
<base href="${path}/pages/">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<title>学生管理系统</title>
<link rel="stylesheet" href="../layuiadmin/layui/css/layui.css" media="all">
</head>
<body>
	
<div class="layui-fluid">
		
	<div class="layui-form" style="margin-top:10px">
		<input type="hidden" name="id" value="${student.id }">
  		<div class="layui-form-item">
    		<label class="layui-form-label">姓名</label>
    		<div class="layui-input-block">
      			<input type="text" name="name" value="${student.name }" lay-verify="required" placeholder="请输入班级名称" autocomplete="off" class="layui-input">
    		</div>
  		</div>
  		<div class="layui-form-item">
    		<label class="layui-form-label">学号</label>
    		<div class="layui-input-block">
      			<input type="text" name="sno" value="${student.sno }" lay-verify="required" placeholder="请输入班级名称" autocomplete="off" class="layui-input">
    		</div>
  		</div>
  		<div class="layui-form-item">
    		<label class="layui-form-label">班级</label>
    		<div class="layui-input-block">
      			<select name="clazzId" id="clazzId" lay-verify="required">
			        <option value=""></option>
			      </select>
    		</div>
  		</div>
  		
  		<div class="layui-form-item">
    		<label class="layui-form-label">图片路径</label>
    		<div class="layui-input-block">
      			<input type="text" name="picPath" id="picPath" value="${student.picPath}" class="layui-input">
    		</div>
  		</div>
  		
  		<div class="layui-form-item">
  			<div class="layui-input-block">
  				<button type="button" class="layui-btn" id="test1">
			  		<i class="layui-icon">&#xe67c;</i>上传图片
				</button>
  			</div>
  		</div>
  		
  		
  		<div class="layui-form-item layui-hide">
	      	<input type="button" lay-submit lay-filter="lay-form-submit" id="lay-form-submit">
	    </div>
  		
  	</div>
</div>

<script src="../layuiadmin/layui/layui.js"></script>
<script>
	layui.config({
		base: '../layuiadmin/' //静态资源所在路径
	}).extend({
	    index: 'lib/index' //主入口模块
	}).use('index');

	layui.use(['form', 'upload'], function() {
		var form = layui.form;
		var $ = layui.$;
		var upload = layui.upload;
		
		
		//文件上传： ajax, name="file"
		upload.render({
    		elem: '#test1', //绑定元素
    		url: '${path}/upload', //上传接口
    		done: function(ret) {
      			//上传完毕回调
      			alert(JSON.stringify(ret));
      			if(ret.success) {
      				$('#picPath').val(ret.data.src);
      			}
    		}
		});
		
		//监听提交
    	form.on('submit(lay-form-submit)', function(data) {
      		var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引  
      		//提交ajax成功后，关闭当前弹层并重载表格
      		$.ajax({
      			type: 'post',
      			url: '${path}/action/student/save',
      			data: data.field,
      			success: function(json) {
      				parent.layui.table.reload('lay-table'); //重载表格
      	      		parent.layer.close(index); //再执行关闭      				
      			}
      		});
    	});
		
		
    	// 加载班级列表，动态加载下拉框
        $.post('${path}/action/clazz/ajax', function(ret) {
    		var elm = document.getElementById('clazzId');
    		elm.options.length = 1; // 只保留
        	for(var i=0; i<ret.length; i++) {
        		var opt = new Option(ret[i].name, ret[i].id);
        		
        		<c:if test="${!empty student}">
        		if(ret[i].id == ${student.clazzId}) {
        			opt.selected = 'selected';
        		}
        		</c:if>
        		
        		elm.options.add(opt);
        	}
        	form.render('select'); //必须的
        });
	});
	
</script>

</body>
</html>